<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
		<title>修改手机号</title>
		<link rel="stylesheet" href="__PUBLIC__/Home/css/common.css">
		<link rel="stylesheet" href="__PUBLIC__/Home/css/main.css">
		<script src="__PUBLIC__/Home/js/zepto.js"></script>
<script>
function verifycode()
{
	var verifysrc='__URL__/verify&rand='+Math.random();
	$('#verify_code').attr('src',verifysrc);
}
function sendsms()
{
	$.ajax({
		type: "post",
		dataType: "json",
		url: "__URL__/sendsms",
		data: {mobile:$('#mobile').val()},
		success: function(json){
			if(json.status<1)
			{
				alert(json.info);
				//$.toast(json.info,'cancel', function() {
				//});
			}
			else
			{
				//$('#successsms').val(json.info);
			}
		}
	})
}
</script>
	</head>
	<body>
		<!--输入验证码的弹框-->
		<div id="maKuang" style="display:none">
			<div class="top">
				<span class="title">输入验证码</span>
				<div class="inputArea">
					<input type="text" id="code"/>
					<p class="ma">
						<img src="/Reg/verify" onclick="verifycode()" id="verify_code"/>
					</p>
				</div>
			</div>
			<div class="bot">
				<a href="javascript:;" class="cancel">取消</a><a href="javascript:;" class="sure">确认</a>
			</div>
		</div>
		<!--遮罩层-->
		<div id="zhezhao" style="display:none"></div>
		<!--正文区域-->
		<div id="gaiTelTop" class="topBackTitle">
			<div class="contain maxWidth">
				<a class="hz back" href="__URL__/baseinfo">&#xe600;</a>修改手机号
			</div>
		</div>
		<div id="gaiTelMain" class="fastscroll ownZiliao">
			<div class="contain maxWidth">
				<div class="inputs">
					<div class="inputArea">
						<span>手机号</span><span>{$user.mobile}</span><!--<input type="tel" placeholder="请输入手机号" id="mobile" value="{$user.mobile}">-->
					</div>
					<div class="inputArea ma">
						<span>短信验证码</span><input type="text" id="sms" placeholder="请输入短信验证码"><em class="sendma">获取验证码</em>
					</div>
					<div class="inputArea">
						<span>新手机号</span><input type="tel" placeholder="请输入新手机号" id="newmobile">
					</div>
				</div>
				<button class="submitbtn">确认</button>
			</div>
		</div>

		<script>
			//返回按钮
			$('#gaiTelTop .back').on('tap',function(){
				window.history.go(-1);
			});

			//点击获取验证码
			$('#gaiTelMain .inputs .inputArea .sendma').on('tap',function(){
				//alert('d');
				$('#maKuang').css('display','block');
				$('#zhezhao').css('display','block');
			});

			//点击取消
			$('#maKuang .bot .cancel').on('tap',function(){
				$('#maKuang .top .inputArea input').val('');//清空弹框input值
				$('#maKuang').css('display','none');
				$('#zhezhao').css('display','none');
			});

			//点击确定
			$('#maKuang .bot .sure').on('tap',function(){
				var getValue=$('#maKuang .top .inputArea input').val();
				//alert(getValue)
				if(getValue=='')
				{
					alert('请输入验证码');
				}
				else
				{
					$.ajax({
						type: "post",
						dataType: "json",
						url: "__URL__/checkcode",
						data: {code:$('#code').val()},
						success: function(json){
							if(json.status<1)
							{
								alert('验证码错误');
							}
							else
							{
								alert('已经发送验证码');
								sendsms();
								$('#maKuang .top .inputArea input').val('');//清空弹框input值
								$('#maKuang').css('display','none');
								$('#zhezhao').css('display','none');
							}
						}
					})
				}
				/*console.log(getValue);
				$('#maKuang .top .inputArea input').val('');//清空弹框input值
				$('#maKuang').css('display','none');
				$('#zhezhao').css('display','none');*/
			});

			//点击确认
			$('#gaiTelMain .submitbtn').on('tap',function(){
				//console.log('确认');
				$.ajax({
						type: "post",
						dataType: "json",
						url: "__URL__/updatemobile",
						data: {mobile:$('#newmobile').val(),'sms':$('#sms').val()},
						success: function(json){
							alert(json.info);
						}
					})
			});
		</script>
	</body>
</html>
